import React, { Component, createContext } from "react";
const { Provider, Consumer } = createContext();
class Child2 extends Component {
  render() {
    return (
      <Consumer>
        {(value) => <span>备注：{value.name}的个人信息</span>}
      </Consumer>
    );
  }
}
class Child extends Component {
  render() {
    return (
      <>
        <Consumer>
          {(value) => (
            <>
              <p>姓名：{value.name}</p>
              <p>年龄{value.age}</p>
              <p>性别：{value.sex}</p>
            </>
          )}
        </Consumer>
        <Child2 />
      </>
    );
  }
}
class App extends Component {
  state = {
    value: { name: "张三", age: 18, sex: "男" },
  };
  render() {
    return (
      <Provider value={this.state.value}>
        <h2>组件通信Conxtext</h2>
        <Child />
      </Provider>
    );
  }
}
export default App;
